<template>
  <div style="margin: 15px; margin-right: 30px;">
    <el-form ref="form" :rules="rules" :model="form" label-width="100px">
      <el-row>
        <el-col :span="24">
          <el-form-item label="通知标题" prop="title">
            <el-input v-model="form.title" placeholder="请输入通知标题" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="通知内容" prop="noticeContent">
            <el-input
              type="textarea"
              :rows="10"
              v-model="form.noticeContent"
              placeholder="请输入通知内容"
            />
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="funcCancel">取 消</el-button>
      <el-button type="primary" @click="funcSubmit">确 定</el-button>
    </div>
  </div>
</template>
<script>
import Vue from "vue";
import "xe-utils";
import VXETable from "vxe-table";
import "vxe-table/lib/index.css";
Vue.use(VXETable);
import { addNoteOrSMSManage } from "@/api/news";
export default {
  name: "SMSManageAdd",
  data() {
    return {
      form: {
        noticeType: 0,
        title: "",
        noticeContent: ""
      },
      rules: {
        title: [{ required: true, message: "请输入通知标题", trigger: "blur" }],
        noticeContent: [
          { required: true, message: "请输入通知内容", trigger: "blur" }
        ]
      }
    };
  },
  created() {},
  methods: {
    funcSubmit() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          const rLoading = this.openLoading();
          addNoteOrSMSManage(this.form)
            .then(response => {
              rLoading.close();
              this.$message({ message: response.msg, type: "success" });
              this.$emit("fatherComplete");
            })
            .then(() => this.$refs["form"].resetFields());
        } else {
          return false;
        }
      });
    },
    // 取消
    funcCancel() {
      this.$emit("fatherComplete");
    }
  }
};
</script>
<style lang="scss" scoped>
.dialog-footer {
  margin: 15px 0 15px 0;
  width: 175px;
  float: right;
}
.el-cascader {
  width: 100%;
}
.el-select {
  width: 100%;
}
</style>
